layui.config({
	base : "/js"
}).use([ 'form', 'layer', 'jquery', 'laypage' ], function() {
	$.post("http://localhost:8088/img/tag/page", {
		pageSize : 2,
		pageNum : 0
	}, function(data) {
		loadTab(data.data.list);
		bindClick();
	})
});


function bindClick(){
	//添加文章
	//改变窗口大小时，重置弹窗的高度，防止超出可视区域（如F12调出debug的操作）
	$(window).one("resize",function(){
		$(".tagAdd_btn").click(function(){
			var index = layui.layer.open({
				title : "添加标签",
				type : 2,
                area: ['800px', '350px'], 
			    shade: [0.8, '#393D49'],
				content : "edit.html",
				success : function(layero, index){
					setTimeout(function(){
						layui.layer.tips('点击此处返回标签列表', '.layui-layer-setwin .layui-layer-close', {
							tips: 3
						});
					},500)
				}
			})			
		})
	}).resize();
}




function loadTab(data) {
	layui.use('table', function() {
		var table = layui.table;
		form = layui.form;
		// 监听性别操作
		form.on('switch(status)', function(obj) {
			layer.tips(this.value + ' ' + this.name + '：' + obj.elem.checked,
					obj.othis);
		});
		// 第一个实例
		table.render({
			elem : '#test',
			height : 'full-180', // 高度最大化减去差值
			data : data,
			page : { // 支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
				layout : [ 'limit', 'count', 'prev', 'page', 'next', 'skip' ] // 自定义分页布局
				// ,curr: 5 //设定初始在第 5 页
				,
				count:80,
				groups : 1 // 只显示 1 个连续页码
				,
				first : false // 不显示首页
				,
				last : false,
				jump:function(data){
					console.info(data);
				}

			},
			// toolbar : true,
			skin : 'row' ,
			even : true, // 开启隔行背景
			// defaultToolbar : [ 'filter' ],
			limit : 2,
			limits : [ 2, 4, 10 ],
			cols : [ [ // 表头
			{
				field : 'id',
				title : 'ID',
				sort : true,
				fixed : 'left'
			}, {
				field : 'name',
				title : '标签名'
			}, {
				field : 'click',
				title : '点击量',
				sort : true
			}, {
				field : 'sort',
				title : '排序'
			}, {
				field : 'type',
				title : '类型'
			}, {
				field : 'createTime',
				title : '创建时间',
				sort : true
			}, {
				field : 'status',
				title : '状态',
				sort : true,
				templet : '#status'
			}, {
				fixed : 'right',
				width : 150,
				align : 'center',
				toolbar : '#barDemo'
			} ] ]
		});

		// 监听工具条
		table.on('tool(test)', function(obj) { // 注：tool是工具条事件名，test是table原始容器的属性
												// lay-filter="对应的值"
			var data = obj.data; // 获得当前行数据
			var layEvent = obj.event; // 获得 lay-event 对应的值（也可以是表头的 event
										// 参数对应的值）
			var tr = obj.tr; // 获得当前行 tr 的DOM对象

			if (layEvent === 'detail') { // 查看
				// do somehing
			} else if (layEvent === 'del') { // 删除
				layer.confirm('真的删除行么', function(index) {
					obj.del(); // 删除对应行（tr）的DOM结构，并更新缓存
					layer.close(index);
					// 向服务端发送删除指令
				});
			} else if (layEvent === 'edit') { // 编辑
				// do something

				// 同步更新缓存对应的值
				obj.update({
					username : '123',
					title : 'xxx'
				});
			}
		});
	});
}